import React from 'react';
import styled from 'styled-components';
import Label from 'components/Basic/Label';
import Description from 'components/Basic/Description';
import HighLighter from 'components/Basic/HighLighter';
import Parameter from 'components/Basic/Parameter';
import { ParameterSection } from 'components/Basic/Section';

const DelegateBySigWrapper = styled.div`
  margin-bottom: 50px;
`;

function DelegateBySig() {
  const formula = `  const venus = new Venus(window.ethereum);

  (async function() {
    const delegateTx = await venus.delegateBySig(
      '0xa0df350d2637096571F7A701CBc1C5fdE30dF76A',
      42,
      9999999999,
      {
        v: '0x1b',
        r: '0x130dbca2fafa07424c033b4479687cc1deeb65f08809e3ab397988cc4c6f2e78',
        s: '0x1debeb8250262f23906b1177161f0c7c9aa3641e8bff5b6f5c88a6bb78d5d8cd'
      }
    );
    console.log('Ethers.js transaction object', delegateTx);
  })().catch(console.error);`;

  return (
    <DelegateBySigWrapper id="venusJS-delegate-by-sig">
      <Label title marginBottom>
        Delegate By Sig
      </Label>
      <Description>
        Delegate voting rights in Venus Governance using an EIP-712 signature.
      </Description>
      <ParameterSection>
        <Parameter name="_address">
          {` (string) The address to delegate the user's voting rights to.`}
        </Parameter>
        <Parameter name="nonce">
          {` (number) The contract state required to match the signature. This can be retrieved from the XVS contract's public nonces mapping.`}
        </Parameter>
        <Parameter name="expiry">
          {` (number) The time at which to expire the signature. A block timestamp as seconds since the unix epoch.`}
        </Parameter>
        <Parameter name="signature">
          {` (object) An object that contains the v, r, and, s values of an EIP-712 signature.`}
        </Parameter>
        <Parameter name="[options]">
          {` (CallOptions) Options to set for eth_call, optional ABI (as JSON object), and Ethers.js method overrides. The ABI can be a string of the single intended method, an array of many methods, or a JSON object of the ABI generated by a Solidity compiler.`}
        </Parameter>
        <Parameter name="RETURN">
          {` (object) Returns an Ethers.js transaction object of the vote transaction.`}
        </Parameter>
      </ParameterSection>
      <HighLighter>{formula}</HighLighter>
    </DelegateBySigWrapper>
  );
}

export default DelegateBySig;
